import React from "react"
import {
  Chart,
  Interval,
  Axis,
  Tooltip,
} from "bizcharts"

export default class Bar extends React.Component {
  render() {
    const data = [
      {year: "1月", sales: 38},
      {year: "2月", sales: 52},
      {year: "3月", sales: 61},
      {year: "4月", sales: 145},
      {year: "5月", sales: 48},
      {year: "6月", sales: 38},
      {year: "7月", sales: 28},
      {year: "8月", sales: 38},
      {year: "59月", sales: 68},
      {year: "10月", sales: 38},
      {year: "11月", sales: 58},
      {year: "12月", sales: 38}
    ]
    const cols = {
      sales: {
        tickInterval: 20
      }
    }
    return (
      <div style={{width: '100%', marginTop: 40}}>
        <Chart height={200} autoFit padding="auto"  data={data} scale={cols} forceFit>
          <Axis name="year"/>
          <Axis name="sales"/>
          <Tooltip
            crosshairs={{
              type: "y"
            }}
          />
          <Interval position="year*sales" />
        </Chart>
      </div>
    )
  }
}

